var watermark = function () {
    if(!document.getElementById('secondCanvas')){//每次页面刷新会重复加载，所以进行判断下，避免加载多个canvas进行叠加
        console.log('呀! 有水印~')
        var fisrst = document.createElement('canvas'),//一张图片
            second = document.createElement('canvas')//平铺的图片
        fisrst.width = 130
        fisrst.height = 180
        fisrst.id = 'firstCanvas'
        fisrst.style.display ='none'

        second.id = 'secondCanvas'
        second.style.pointerEvents = 'none'
        second.style.margin = '0 0 0 20px'
        second.style.opacity = '0.3'

        var imgObj = new Image()
        imgObj.src= require('@/assets/images/ncepu_logo.png')//水印图片
        imgObj.onload = function () {
            var canvasFirst,canvasSecond,ctxFirst,ctxSecond

            canvasFirst = document.getElementById('firstCanvas') as HTMLCanvasElement
            canvasSecond = document.getElementById('secondCanvas') as HTMLCanvasElement

            if(canvasFirst){
                ctxFirst = canvasFirst.getContext('2d')
                ctxSecond = canvasSecond.getContext('2d')
                if(ctxFirst){
                    ctxFirst.drawImage(imgObj,0,0,70,50);//把图片绘制到画布上
                }
                canvasSecond.width = document.documentElement.clientWidth;//获取可视宽度
                canvasSecond.height = document.documentElement.clientHeight;
                if(ctxSecond){
                    ctxSecond.clearRect(0,0,canvasSecond.width,canvasSecond.height);//清画布
                    var pat = ctxSecond.createPattern(canvasFirst, "repeat");//在指定的方向上重复指定的元素
                    ctxSecond.fillStyle = pat||'0';
                    ctxSecond.fillRect(0,0, canvasSecond.width, canvasSecond.height);//绘制填充

                }
            }
           }
        document.body.appendChild(fisrst);
        document.body.appendChild(second);
    }
}

export default watermark